
import React from 'react'
// import '../../index.scss'
export default class Product extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            productNav:[
                {url:'/static/indexImg/phone@2x.png',txt:'移动端解决方案',color:'#fa6d6b'},
                {url:'/static/indexImg/PC@2x.png',txt:'PC端解决方案',color:'#ed9f29'},
                {url:'/static/indexImg/apply@2x.png',txt:'行业应用解决方案',color:'#55a8ea'},
                {url:'/static/indexImg/custom@2x.png',txt:'定制软件解决方案',color:'#50ca84'},
                {url:'/static/indexImg/net@2x.png',txt:'网络安全解决方案',color:'#8fd33e'},
            ],
        }
    }
    render(){
        return (
           <div className='product'>
                <div className='pro_tit'>
                    <img className='pro_tit_img' src="/static/indexImg/rule@2x.png" alt=""/>
                    <span className='pro_tit_info'>产品及服务</span>
                </div>
               <ul className='pro_con clearfix'>
                   {
                       this.state.productNav.map((item) => {
                           return (
                               <li className='pro_con_item fr' key={item.txt} style={{background: item.color}}>
                                   <img src={item.url} alt=""/>
                                   <span>{item.txt}</span>
                               </li>
                           )
                       })
                   }
               </ul>
           </div>
        )
    }
}